<template>
  <div class="app-container">
    <el-tabs v-model="activeName" type="border-card">
      <el-tab-pane label="正进行" name="first">
        <runningProc ref="runningProc" />
      </el-tab-pane>
      <el-tab-pane label="已结束" name="second">
        <historyProc ref="historyProc" />
      </el-tab-pane>
    </el-tabs>
    <!--show组件-->
    <awardShow ref="awardShow" />
    <trainingShow ref="trainingShow" />
    <socialJobShow ref="socialJobShow" />
    <publishShow ref="publishShow" />
    <leaveShow ref="leaveShow" />
  </div>
</template>

<script>
import awardShow from '../../edu/award/list/show'
import trainingShow from '../../edu/training/list/show'
import socialJobShow from '../../edu/socialjob/list/show'
import publishShow from '../../edu/publish/list/show'
import leaveShow from '../../edu/leave/list/show'
import runningProc from './running.vue'
import historyProc from './history.vue'
export default {
  name: 'ProcessInst',
  components: { runningProc, historyProc, awardShow, trainingShow, socialJobShow, publishShow, leaveShow },
  data() {
    return {
      activeName: 'first'
    }
  },
  created() {
    if (this.$route.query && this.$route.query.tabinx === '2') {
      this.activeName = 'second'
    }
  },
  methods: {
    handleShow(row) {
      if (row.procDefKey === 'award') {
        this.$refs.awardShow.show(row.businessKey)
      } else if (row.procDefKey === 'training') {
        this.$refs.trainingShow.show(row.businessKey)
      } else if (row.procDefKey === 'socialJob') {
        this.$refs.socialJobShow.show(row.businessKey)
      } else if (row.procDefKey === 'publish') {
        this.$refs.publishShow.show(row.businessKey)
      } else if (row.procDefKey === 'leave') {
        this.$refs.leaveShow.show(row.businessKey)
      }
    }
  }
}
</script>
